<template>
  <div class="aidOnline knowledgeApply">
    <!-- <ProtectFakeData :fakeData="aidFakeData"></ProtectFakeData> -->
    <!-- <div class="aidOnline-img">
      <img src="../../../assets/images/aidOnlien.png" alt="">
      <div>维权援助流程图</div>
    </div> -->
    <div class="table">
      <div class="title">{{title}}</div>
      <a-tabs type="card" @change="tabChange" v-model="tabIndex">
        <a-tab-pane key="0" tab="单位申请填写">
        </a-tab-pane>
        <a-tab-pane key="1" tab="个人申请填写">
        </a-tab-pane>
      </a-tabs>
      <div class="subheading">{{ headerTitle }}</div>
      <div class="form">
        <CommonForm :tableForm="tableForm" />
      </div>
      <div class="subheading">所交申请及证明材料（由申请人在所选项后的方框内打“√”）</div>
      <CommonForm ref="uploadForm" :tableForm="uploadForm" :type="2"></CommonForm>
      <div class="subheading">申请援助事项（由申请人在所选项后的方框内打“√”）</div>
      <CommonForm :tableForm="selectForm" :type="2"></CommonForm>
      <div class="btn">
        <a-button class="submit" @click="submit">提交</a-button>
        <a-button @click="resetClick">重置</a-button>
      </div>
    </div>
  </div>
</template>

<script>
// import ProtectFakeData from '../../components/pageComponents/protectFakeData.vue'
import CommonForm from '@/components/commonForm'
// import { aidFakeData } from '../config.js'
import {safeguard} from '@/api/protectionOfRights'
import FrontMixins from '@/mixins/frontMixin'

export default {
  mixins: [FrontMixins],
  data () {
    return {
      // aidFakeData,
      tableForm: [],
      title:'知识产权维权援助申请表',
      unitForm: [
        [
          { span: 8, label: '申请企业（或组织）名称' },
          { span: 16, value: '', props: 'qyName' }
        ],
        [
          { span: 3, label: '法定代表人' },
          { span: 5, value: '', props: 'qyLegalPerson' },
          { span: 3, label: '经办人' },
          { span: 5, value: '', props: 'qyOperator' },
          { span: 3, label: '地 址' },
          { span: 5, value: '', props: 'qyAddress' },
        ],
        [
          { span: 3, label: '营业执照编号' },
          { span: 5, value: '', props: 'qyCode' },
          { span: 3, label: '职 务' },
          { span: 5, value: '', props: 'qyJob' },
          { span: 3, label: '手 机' },
          { span: 5, value: '', props: 'qyPhone' },
        ],
      ],
      userForm: [
        [
          { span: 3, label: '申请人' },
          { span: 5, value: '', props: 'applicant' },
          { span: 3, label: '性别' },
          { span: 5, value: '', props: 'sex' },
          { span: 3, label: '年龄' },
          { span: 5, value: '', props: 'age' },
        ],
        [
          { span: 3, label: '工作单位' },
          { span: 13, value: '', props: 'unit' },
          { span: 3, label: '身份证号' },
          { span: 5, value: '', props: 'idCard' }
        ],
        [
          { span: 3, label: '通讯地址' },
          { span: 13, value: '', props: 'address' },
          { span: 3, label: '联系方式' },
          { span: 5, value: '', props: 'contact' }
        ],
      ],
      tableFormCopy: [],
      headerTitle: '单位申请填写',
      unitFormCopy: [],
      userFormCopy: [],
      uploadForm: [
        [
          { span: 12, value: '', props: 'qyCodeFile', label: '1、营业执照（复印件）', type: 'upload' },
          { span: 12, value: '', props: 'qyDifficultFile', label: '2、企业经济困难证明', type: 'upload' },
        ],
        [
          { span: 12, value: '', props: 'ownershipFile', label: '3、知识产权权属证明', type: 'upload' },
          { span: 12, value: '', props: 'weakFile', label: '4、处于弱势地位的说明', type: 'upload' },
        ],
        [
          { span: 12, value: '', props: 'assistFile', label: '5、援助事项或案件相关材料', type: 'upload' },
          { span: 12, value: '', props: 'otherFile', label: '6、其他证明材料', type: 'upload' },
        ],
      ],
      selectForm: [
        [
          { span: 12, value: [], props: 'applyAssist1', label: '知识产权法律咨询', type: 'check', plainOptions: [{ label: '', value: '0' }] },
          { span: 12, value: [], props: 'applyAssist2', label: '知识产权纠纷案件', type: 'check', plainOptions: [{ label: '', value: '1' }] },
        ],
        [
          { span: 12, value: [], props: 'applyAssist3', label: '知识产权纠纷调解', type: 'check', plainOptions: [{ label: '', value: '2' }] },
          { span: 12, value: [], props: 'applyAssist4', label: '知识产权侵权判定咨询', type: 'check', plainOptions: [{ label: '', value: '3' }] },
        ],
        [
          { span: 8, label: '其它知识产权维权援助事项 （填写具体事项）' },
          { span: 16, value: '', props: 'applyAssistOther', type: 'textarea' },
        ],
      ],
      uploadFormCopy: [],
      selectFormCopy: [],
      tabIndex: '0'
    }
  },
  components: {
    // ProtectFakeData,
    CommonForm
  },
  created () {
    this.unitFormCopy = JSON.parse(JSON.stringify(this.unitForm))
    this.userFormCopy = JSON.parse(JSON.stringify(this.userForm))
    this.uploadFormCopy = JSON.parse(JSON.stringify(this.uploadForm))
    this.selectFormCopy = JSON.parse(JSON.stringify(this.selectForm))
    this.tableForm = this.unitForm
  },
  methods: {
    tabChange (val) {
      if (val === '0') {
        this.tableForm = JSON.parse(JSON.stringify(this.unitFormCopy))
        this.headerTitle = '单位申请填写'
      } else {
        this.tableForm = JSON.parse(JSON.stringify(this.userFormCopy))
        this.headerTitle = '个人申请填写'
      }
    },
    resetClick () {
      this.tabIndex = '0'
      this.headerTitle = '单位申请填写'
      this.tableForm = JSON.parse(JSON.stringify(this.unitFormCopy))
      this.uploadForm = JSON.parse(JSON.stringify(this.uploadFormCopy))
      this.selectForm = JSON.parse(JSON.stringify(this.selectFormCopy))
    },
    submit () {
      if (this.authorityManagement()) {
        return
      }
      let isRequired = true
      let checkFormUnit = [
        {props: 'qyPhone',checkRules:/^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/,message:'请填写正确的手机!'},
      ]
      
      let checkFormUser = [
        {props: 'idCard',checkRules:/^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/,message:'请填写正确的身份证号码!'},
        {props: 'contact',checkRules:/^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/,message:'请填写正确的联系方式!'},
      ]
      let checkForm = []
      if(this.tabIndex === '0') {
        checkForm = checkFormUnit
      }else{
        checkForm = checkFormUser
      }
      let isRules = []
      this.tableForm.forEach(item=>{
        item.forEach(ele=>{
          if(ele.props && !ele.noRequired && ele.value === '') {
            isRequired = false
          }
          // 下面是校验
          checkForm.forEach(res=>{
            if(res.props === ele.props) {
              if(!res.checkRules.test(ele.value)) {
                this.$message.warning(res.message)
                isRules.push(true)
              }
            }
          })
        })
      })
     
      // 校验不通过
      if(isRules.some(ele=>ele)) {
        return
      }
    
      if(!isRequired) {
        this.$message.warning('有必填或必选项没有填写或选择。')
        return
      }
      
      this.$confirm({
        title: '一旦提交不可修改，请认真检查，是否确认提交；是，就提交上去；否，返回检查可继续修改表单',
        onOk:()=> {
          let obj = {
            status: "0",
            type: this.tabIndex
          }
         
          this.tableForm.forEach(item => {
            item.forEach(ele => {
              if (ele.props) {
                obj[`${ele.props}`] = ele.value
              }
            })
          })
          this.uploadForm.forEach(item=>{
            item.forEach(ele => {
              if (ele.props) {
                obj[`${ele.props}`] = ele.value
              }
            })
          })
          this.selectForm.forEach(item=>{
            item.forEach(ele => {
              if (ele.props) {
                obj[`${ele.props}`] = ele.value
              }
            })
          })
          let applyAssist = []
          if(obj.applyAssist1 || obj.applyAssist2 || obj.applyAssist3 || obj.applyAssist4) {
            applyAssist = [...obj.applyAssist1,...obj.applyAssist2,...obj.applyAssist3,...obj.applyAssist4]
            
          }
          obj.applyAssist = applyAssist.join(',')
         
          delete obj.applyAssist1
          delete obj.applyAssist2
          delete obj.applyAssist3
          delete obj.applyAssist4
          
          safeguard(obj).then(res=>{
            let {code,msg} = res
            if(code === 200) {
              this.$message.success(`您已成功提交${this.title}业务申请`)
              this.resetClick()
              this.$refs.uploadForm.clearUpload()
            }else{
              this.$message.error(msg)
            }
          })
        },
        onCancel() {
        },
        class: 'test',
      });
    },
  }
}
</script>